<?xml version="1.0" encoding="UTF-8"?>

<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:p="http://primefaces.org/ui" template="/masterPage.xhtml">
	<ui:define name="content">
		<h:form id="users_list_form">
			<p:growl id="messages" showDetail="true" sticky="true" />

			<p:toolbar id="toolbar"  style="margin-top:20px; margin-bottom:5px">
				<p:toolbarGroup align="left">
					<p:commandButton value="Create"
						action="#{usersBean.showCreateDialog}" style="font-size: 85% !important"/>
					<p:commandButton value="Edit" action="#{usersBean.showEditDialog}"
						update=":editdlg_form:editdlg, messages" style="font-size: 85% !important"/>
					<p:commandButton value="View" action="#{usersBean.showViewDialog}"
						update=":viewdlg_form:viewdlg, messages" style="font-size: 85% !important"/>
					<p:commandButton value="Block"
						action="#{usersBean.showBlockDialog}"
						update=":blocked_form:blockdlg, messages" style="font-size: 85% !important"/>
					<p:commandButton value="Edit Permissions"
						actionListener="#{usersBean.showPermissionsDialog}"
						update=":editPermis_form:permissionsdlg, messages" style="font-size: 85% !important"/>
				</p:toolbarGroup>
			</p:toolbar>
			<p:dataTable id="usersTable" var="user" value="#{usersBean.users}"
				rowKey="#{user.id}" selection="#{usersBean.selectedUser}"
				selectionMode="single">
				<p:column id="user_id" headerText="ID" sortBy="#{user.id}">
					<h:outputText value="#{user.id}" />
				</p:column>
				<p:column id="user_firstName" headerText="First Name">
					<h:outputText value="#{user.firstName}" />
				</p:column>
				<p:column id="user_lastName" headerText="Last Name">
					<h:outputText value="#{user.lastName}" />
				</p:column>
				<p:column id="user_email" headerText="E-mail">
					<h:outputText value="#{user.email}" />
				</p:column>
				<p:column id="user_login" headerText="Login">
					<h:outputText value="#{user.login}" />
				</p:column>
				<p:column id="user_isBlocked" headerText="Is Blocked">
					<p:selectBooleanCheckbox value="#{user.isBlocked}" />
				</p:column>

			</p:dataTable>
		</h:form>

		<h:form id="viewdlg_form">
			<p:dialog id="viewdlg" header="View Dialog" widgetVar="viewdlg"
				modal="true">
				<ui:include src="dialogs/viewDialog.xhtml" />
			</p:dialog>
		</h:form>

		<h:form id="blocked_form">
			<p:dialog id="blockdlg" header="Block Dialog" widgetVar="blockdlg"
				modal="true">
				<ui:include src="dialogs/blockedDialog.xhtml" />
			</p:dialog>
		</h:form>

		<h:form id="editPermis_form">
			<p:dialog id="permissionsdlg" header="Edit User Permissions"
				widgetVar="permissionsdlg" modal="true" height="350">
				<ui:include src="dialogs/permissionsDialog.xhtml" />
			</p:dialog>
		</h:form>

		<h:form id="editdlg_form">
			<p:dialog id="editdlg" header="Edit Dialog" widgetVar="editdlg"
				modal="true">
				<ui:include src="dialogs/editUserDialog.xhtml" />
			</p:dialog>

			<script type="text/javascript">
                function handleEditUserRequest(xhr, status, args) {
                    if(args.validationFailed || !args.editUser) {
                        jQuery('#editdlg').effect("shake", { times:3 }, 100);
                    } else {
                        editdlg.hide();
                    }
                }
            </script>
		</h:form>

		<h:form id="createdlg_form">
			<p:dialog id="createdlg" header="Create New User"
				widgetVar="createdlg" modal="true">
				<ui:include src="dialogs/newUserDialog.xhtml" />
			</p:dialog>

			<script type="text/javascript">
                function handleCreateUserRequest(xhr, status, args) {
                    if(args.validationFailed || !args.saveUser) {
                        jQuery('#createdlg').effect("shake", { times:3 }, 100);
                    } else {
                        createdlg.hide();
                    }
                }
            </script>
		</h:form>

	</ui:define>
</ui:composition>